<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>SCIM Viewer</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="stylesheet" type="text/css" href="css/prettify.css" />
</head>
<body>
  <div id="container">
    <div id="header" class="page-header">
      <h1>SCIMProxy Viewer</h1>
    </div>
    <div class="navbar">
      <div class="navbar-inner">
        <div class="container">
          <ul class="nav">
            <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">List</a>
              <ul class="dropdown-menu">
                <li><a href="#1" data-toggle="tab" id="listUsers">Users</a></li>
                <li><a href="#1" data-toggle="tab" id="listGroups">Groups</a></li>
              </ul>
            </li>
            <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Add</a>
              <ul class="dropdown-menu">
                <li><a href="#2" data-toggle="tab" id="createUser">User</a></li>
                <li><a href="#2" data-toggle="tab" id="createGroup">Group</a></li>
              </ul>
            </li>
            <li><a href="#3" data-toggle="tab" id="bulk">Bulk</a></li>
            <li><a href="#4" data-toggle="tab" id="compliance">Compliance Test</a></li>
            <li class="divider-vertical"></li>
          </ul>
          <a class="brand" id="currentAction">List Users</a>
          <form class="navbar-form pull-right">
            <ul class="nav">
              <li><a href="viewer-advanced.html" id="bulk">Advanced</a></li>
            </ul>
          </form>
        </div>
      </div>
    </div>
    <div class="tabbable">
      <div class="tab-content">
        <div class="tab-pane active" id="1">
          <form class="well">
            <fieldset>
              <legend>Filter</legend>
              <div class="row-fluid">
                <div class="span4">
                  <select id="filter-attribute">
                    <option value></option>
                  </select>
                </div>
                <div class="span4">
                  <select id="filter-operation">
                    <option value="eq">Equals</option>
                    <option value="co">Contains</option>
                    <option value="sw">Starts with</option>
                    <option value="pr">Present</option>
                    <option value="gt">Greater than</option>
                    <option value="ge">Greater than or equal</option>
                    <option value="lt">Lesser than</option>
                    <option value="le">Lesser than or equal</option>
                  </select>
                </div>
                <div class="span4">
                  <input id="filter-attribute-value" placeholder="value" />
                </div>
              </div>
            </fieldset>
            <fieldset>
              <legend>Sort</legend>
              <div class="row-fluid">
                <div class="span4">
                  <select id="sort-attribute">
                    <option value></option>
                  </select>
                </div>
                <div class="span4">
                  <select id="sort-operation">
                    <option>ascending</option>
                    <option>descending</option>
                  </select>
                </div>
              </div>
            </fieldset>
            <fieldset>
              <legend>Include Attributes</legend>
              <div class="row-fluid">
                <div class="span3">
                  <div class="control-group">
                    <label class="control-label" for="include-attribute">Available</label>
                    <div class="controls">
                      <select id="include-attribute" multiple="multiple">
                      </select>
                    </div>
                  </div>
                </div>
                <div class="span1">
                  <div class="row-fluid">
                    <div class="span12">&nbsp;</div>
                  </div>
                  <div class="row-fluid">
                    <div class="span12">
                      <img id="addIncludeAttribute" src="/images/Right-icon.png" align="top" class="addRemoveIcon" />
                    </div>
                  </div>
                  <div class="row-fluid">
                    <div class="span12">
                      <img id="removeIncludeAttribute" src="/images/Left-icon.png" align="top" class="addRemoveIcon" />
                    </div>
                  </div>
                </div>
                <div class="span2">
                  <div class="control-group">
                    <label class="control-label" for="include-attribute">Selected</label>
                    <div class="controls">
                      <select id="included-attributes" multiple="multiple">
                      </select>
                    </div>
                  </div>
                </div>
              </div>
            </fieldset>
            <div style="text-align: right;">
              <button class="btn" id="reset-listform">Reset</button>
              <button type="submit" class="btn btn-primary" id="list">List</button>
            </div>
          </form>
          <div class="well" id="list-result"></div>
        </div>
        <div class="tab-pane" id="2">
          <div class="well">
            <form id="form">
              <div id="currentAttributes"></div>
              <select id="newAttributes">
              </select> <img id="addAttribute" src="/images/Add-icon.png" align="top" class="addRemoveIcon" />
            </form>
            <div style="text-align: right;">
              <button class="btn" id="reset">Reset</button>
              <button type="submit" class="btn btn-primary" id="createResource">Create</button>
            </div>
          </div>
          <div class="well">
            <pre class="prettyprint, full" style="display: none;" id="create-result">
            </pre>
          </div>
        </div>
        <div class="tab-pane" id="3">
          <div class="well">
            <label class="control-label" for="bulkEncoding">Encoding</label>
            <div class="controls">
              <select id="bulkEncoding">
                <option>json</option>
              </select>
            </div>
            <label class="control-label" for="">Data</label>
            <div class="controls">
              <textarea id="bulkData" rows="15" style="width: 99%"></textarea>
            </div>
            <div style="text-align: right;">
              <button class="btn" id="resetBulk">Reset</button>
              <button type="submit" class="btn btn-primary" id="sendBulk">Send</button>
            </div>
          </div>
          <div class="well">
            <pre class="prettyprint, full" style="display: none;" id="bulk-result">
            </pre>
          </div>
        </div>
        <div class="tab-pane" id="4">
          <div class="well">
            
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="modal" id="editDialog">
    <div class="modal-header">
      <a class="close" data-dismiss="modal">×</a>
      <h3>Edit user</h3>
    </div>
    <div class="modal-body">
      <div id="editContent"></div>
      <select id="editSelect"></select><img id="addEditAttribute" src="/images/Add-icon.png" align="top"
        class="addRemoveIcon"
      />
    </div>
    <div class="modal-footer">
      <a href="#" data-dismiss="modal" class="btn">Close</a> <a href="#" class="btn btn-primary" id="replace">Replace</a>
      <a href="#" class="btn btn-primary" id="update">Update</a>
    </div>
  </div>
</body>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.simplemodal-1.4.2.js"></script>
<script type="text/javascript" src="js/jquery.selectboxes.js"></script>
<script type="text/javascript" src="js/prettify/prettify.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap.js"></script>
<script type="text/javascript" src="bootstrap/js/bootstrap-tab.js"></script>
<script type="text/javascript" src="js/userConfig.js"></script>
<script type="text/javascript" src="js/groupConfig.js"></script>

<script type="text/javascript" src="Viewer/Compliance"></script>

<script type="text/javascript" src="js/viewer3.js"></script>
</html>